<script setup lang="ts">
import { inject } from 'vue'
import axios from 'axios'

const {
  ioInstance,
  baseUri,
  throughGatewayFlag,
  sendMsg
} = inject('pyImgHandlerIo') as any
const phaseInfo = inject('phaseInfo') as any
const viewType = inject('viewType') as any

const handleClick = async (item) => {
  const prefix = throughGatewayFlag ? `${baseUri}/image/` : `${baseUri}/`
  await axios.post(`${prefix}changePhase`, {
    toPhaseIndex: item,
    viewType: viewType
  })
}

</script>

<template>
  <div class="w-full h-full"  v-if="phaseInfo?.total > 1">
    <el-button
      v-for="item in phaseInfo.total"
      @click="handleClick(item - 1)"
      :type="(item - 1) == phaseInfo.current ? 'primary' : 'default'"
    >
      {{ item }}
    </el-button>
  </div>
</template>

<style scoped>

</style>
